<template>
  <div class="receipt-order-edit-wrapper app-container" style="margin-bottom: 60px" v-loading="loading">
    <el-card header="基本信息">
      <el-row :gutter="10">
        <el-form ref="elForm" :model="headerList" :rules="rules" size="small" label-width="130px">
          <!-- <el-col :span="12">
            <el-form-item label="仓库" prop="cwarehouseid">
              <el-select v-model="headerList.cwarehouseid" placeholder="请选择仓库" :style="{ width: '100%' }" clearable
                @change="handleCwarehouseidChange">
                <el-option v-for="item in NccStockOptions" :key="item.index" :label="item.label"
                  :value="item.value"></el-option>
              </el-select>
            </el-form-item>
          </el-col> -->
          <!-- 以下仓库下拉框信息是分配仓库给出的仓库，实际业务中用 -->
          <el-col :span="12">
            <el-form-item label="仓库" prop="cwarehouseid">
              <el-select v-model="headerList.cwarehouseid" placeholder="请选择仓库" :style="{ width: '100%' }" clearable
                @change="handleCwarehouseidChange" :disabled="isWarehouseSelectDisabled">
                <el-option v-for="item in warehouseOptions" :key="item.index" :label="item.label"
                  :value="item.value"></el-option>
              </el-select>
            </el-form-item>
          </el-col>

          <!-- <el-col :span="12">
            <el-form-item label="采购员" prop="nccUser">
              <el-select v-model="headerList.nccUser" placeholder="请选择人员信息" clearable :style="{ width: '100%' }" remote
                :remote-method="searchSelectNccUserCode" :loading="loading" filterable>
                <el-option v-for="item in usernameOptions" :key="item.pk" :label="item.name" :value="item.pk" />
              </el-select>
            </el-form-item>
          </el-col> -->
          <el-col :span="12">
            <el-form-item label="仓库管理员" prop="nccUserPro">
              <el-select v-model="headerList.nccUserPro" placeholder="请选择人员信息" clearable :style="{ width: '100%' }"
                remote :remote-method="searchSelectNccUserCodePro" :loading="loading" filterable>
                <el-option v-for="item in usernameOptions" :key="item.pk" :label="item.name" :value="item.pk" />
              </el-select>
            </el-form-item>
          </el-col>
          <!-- <el-col :span="12">
            <el-form-item label="仓库管理员" prop="nccUserPro">
              <el-select v-model="headerList.nccUserPro" placeholder="请选择人员信息" clearable :style="{ width: '100%' }"
                remote :remote-method="searchSelectNccUserList" :loading="loading" filterable>
                <el-option v-for="item in NccUserOptions" :key="item.pk" :label="item.name" :value="item.pk" />
              </el-select>
            </el-form-item>
          </el-col> -->
          <el-col :span="12">
            <el-form-item label="部门信息" prop="deptName">
              <el-select v-model="headerList.deptName" placeholder="请输入部门信息" clearable :style="{ width: '100%' }" remote
                :remote-method="searchSelectNccDept" :loading="loading" filterable>
                <el-option v-for="item in deptNameOptions" :key="item.pk" :label="item.name" :value="item.pk" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="订单日期" prop="drequiredate">
              <el-date-picker v-model="headerList.drequiredate" type="datetime" format="yyyy-MM-dd HH:mm:ss"
                value-format="yyyy-MM-dd HH:mm:ss" placeholder="请选择日期" clearable :style="{ flex: '1', width: 'auto' }">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="备注" prop="vnote">
              <el-input v-model="headerList.vnote" placeholder="请输入备注" clearable :style="{ width: '100%' }"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="出入库类型" prop="ctrantypeid">
              <el-select v-model="headerList.ctrantypeid" placeholder="请选择类型" clearable disabled>
                <el-option v-for="item in ctrantypeidOptions" :key="item.dictLabel" :label="item.dictLabel"
                  :value="item.dictValue" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="物料信息" prop="materialName">
              <el-select v-model="headerList.materialName" placeholder="请选择物料信息" clearable :style="{ width: '100%' }"
                remote :remote-method="debounceSearchSelectNccMaterial" :loading="loading" filterable
                @change="handleMaterialChange">
                <el-option v-for="item in materialNameOptions" :key="item.pk" :label="item.name" :value="item.pk" />
              </el-select>
            </el-form-item>
          </el-col>

          <el-col :span="12" style="display: inline-block; margin-left: -80px;">
            <el-form-item>
              <el-switch v-model="headerList.modeCode" :active-value="1" :inactive-value="0" active-color="#13ce66"
                inactive-color="#ff4949" active-text="按编码查" inactive-text="按名称查" @change="checkModeCodeChange" />
            </el-form-item>
          </el-col>

        </el-form>
      </el-row>
    </el-card>

    <!-- 表格部分 -->
    <el-card class="mt20">
      <el-row :gutter="10" class="mb8" type="flex" justify="space-between">
        <el-col :span="6"><span style="font-size: large">其他入库单</span></el-col>
      </el-row>
      <el-form ref="elForm" :rules="rules" size="small">
        <el-table :data="materialList" border @selection-change="handleTableSelectionChange" label-position="top"
          :row-key="row => row.id">
          <!-- 选择框列 -->
          <el-table-column type="selection" width="40" :reserve-selection="true" />
          <el-table-column label="物料信息">
            <template #default="{ row }">
              <div>
                <div>物料名称：</div>
                <div>{{ row.name }}</div>
              </div>
              <div>
                <div>物料编码：</div>
                <div>{{ row.code }}</div>
              </div>
              <div>
                <div>物料PK：</div>
                <div>{{ row.pk_material }}</div>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="物料管理信息">
            <template #default="{ row }">
              <div>
                <div>GMP码：</div>
                <div>{{ row.GMP }}</div>
              </div>
              <div>
                <div>规格：</div>
                <div>{{ row.materialspec }}</div>
              </div>
              <div>
                <div>型号：</div>
                <div>{{ row.materialtype }}</div>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="库房信息">
            <template #default="{ row }">
              <div>
                <div>库房名称：</div>
                <div>{{ row.cwarehouse_name }}</div>
              </div>
              <!-- <div>
                <div>库房ID：</div>
                <div>{{ row.cwarehouse_id }}</div>
              </div> -->
              <div>
                <div>货位号：</div>
                <div>{{ row.sto_unit_id }}</div>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="批号信息">
            <template #default="{ row }">
              <!-- <div>
                <div>批准文号：</div>
                <div>{{ row.PZWH }}</div>
              </div>
              <div>
                <div>持有人/注册人：</div>
                <div>{{ row.SSCYR }}</div>
              </div> -->
              <div>
                <div>供应商批号：</div>
                <!-- <div>{{ row.vvendbatchcode }}</div> -->
                <el-input v-model="row.vvendbatchcode" placeholder="请输入供应商批号" clearable size="small"></el-input>
              </div>
              <div>
                <div>批号：</div>
                <el-input v-model="row.vbatchcode" placeholder="请输入批次号" clearable :disabled="row.wholemanaflag === 'N'"
                  size="small"></el-input>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="数量信息">
            <template #default="{ row }">
              <div>
                <div>库存数量：</div>
                <div>{{ row.sku_num }}</div>
              </div>
              <div>
                <div>在途数量：</div>
                <div>{{ row.enable_num }}</div>
              </div>
              <div>
                <div>冻结数量：</div>
                <div>{{ row.freeze_num }}</div>
              </div>
              <div>
                <div>可用数量：</div>
                <div>{{ row.use_num }}</div>
              </div>
              <div>
                <div>换算系数：</div>
                <div>{{ row.HSXS }}</div>
              </div>
            </template>
          </el-table-column>
          <!-- 数量 -->
          <el-table-column label="数量修改">
            <template #default="{ row }">
              <!-- <div>
                <div><i class="mark-red"></i>实收主数量：</div>
                <el-input v-model="row.nnum" placeholder="请输入数量" clearable size="small"
                  @input="calculateAssistNum(row)"></el-input>
              </div>
              <div>
                <div>实收辅数量：</div>
                <el-input v-model="row.nassistnum" placeholder="请输入数量" clearable size="small" readonly></el-input>
              </div> -->
              <div>
                <div><i class="mark-red"></i>应收主数量：</div>
                <el-input v-model="row.nshouldnum" placeholder="请输入数量" clearable size="small"
                  @input="calculateAssistNshouldNum(row)"></el-input>
              </div>
              <div>
                <div>应收辅数量：</div>
                <el-input v-model="row.nshouldassistnum" placeholder="请输入数量" clearable size="small" readonly></el-input>
              </div>
            </template>
          </el-table-column>
          <!-- 新增的NCC生产厂商信息和NCC供应商信息下拉选择框列 -->
          <el-table-column :data="proList" label="NCC信息" width="280">
            <template #default="{ row }">
              <!-- <div>
                <div>生产商:</div>
                <el-select v-model="row.manufacturerName" placeholder="请输入生产商" clearable :style="{ width: '100%' }"
                  remote :remote-method="searchSelectNccManufacturer" :loading="loading" filterable
                  :disabled="row.Is_kc_Code == '2' || row.Is_kc_Code == '3'" @change="handleManufacturerNameChange">
                  <el-option v-for="item in manufacturerNameOptions" :key="item.pk" :label="item.name"
                    :value="item.pk" />
                </el-select>
              </div> -->
              <!-- 生产商通过接口传的product_name值映射下拉框后，再传给后端，从在映射查下拉框时出现好多相似的名称 -->
              <!-- 给接口传的值是Code -->
              <!-- <div>
                <div>生产商:</div>
                <el-input v-model="row.product_name" placeholder="请输入生产商" clearable disabled size="small"
                  v-show="row.showInputManufacturer"></el-input>
                <el-select v-model="row.manufacturerName" placeholder="请输入生产商" clearable :style="{ width: '100%' }"
                  remote :remote-method="searchSelectNccManufacturer" :loading="loading" filterable
                  :disabled="row.Is_kc_Code == '2' || row.Is_kc_Code == '3'" @change="handleManufacturerNameChange"
                  v-show="!row.showInputManufacturer">
                  <el-option v-for="(item, index) in manufacturerNameOptions" :key="index" :label="item.name"
                    :value="item.pk" />
                </el-select>
              </div> -->
              <!-- 给接口传的值是PK  :disabled="row.Is_kc_Code == '2' || row.Is_kc_Code == '3'" -->
              <div>
                <div>生产商:</div>
                <el-input v-model="row.product_name" placeholder="请输入生产商" clearable disabled size="small"
                  v-show="row.showInputManufacturer"></el-input>
                <el-select v-model="row.manufacturerName" placeholder="请输入生产商" clearable :style="{ width: '100%' }"
                  remote :remote-method="searchSelectNccManufacturerPk" :loading="loading" filterable
                  :disabled="row.Is_kc_Code == '1' || row.Is_kc_Code == ''" @change="handleManufacturerNameChange"
                  v-show="!row.showInputManufacturer">
                  <el-option v-for="(item, index) in manufacturerNameOptions" :key="index" :label="item.name"
                    :value="item.pk" />
                </el-select>
              </div>


              <!-- CC核对NCC没有-供应商，先注释掉 -->
              <!-- <div>
                <div>供应商:</div>
                <el-select v-model="row.supplierName" placeholder="请输入供应商" clearable :style="{ width: '100%' }" remote
                  :remote-method="searchSelectNccSupplier" :loading="loading" filterable
                  @change="handleSupplierNameChange">
                  <el-option v-for="item in supplierNameOptions" :key="item.pk" :label="item.name" :value="item.pk" />
                </el-select>
              </div> -->
              <!-- 给接口传的值是Code -->
              <!-- <div>
                <div>供应商:</div>
                <el-input v-model="row.sender_name" placeholder="请输入供应商" clearable disabled size="small"
                  v-show="row.showInputSupplier"></el-input>
                <el-select v-model="row.supplierName" placeholder="请输入供应商" clearable :style="{ width: '100%' }" remote
                  :remote-method="searchSelectNccSupplier" :loading="loading" filterable
                  @change="handleSupplierNameChange" v-show="!row.showInputSupplier">
                  <el-option v-for="(item, index) in supplierNameOptions" :key="index" :label="item.name"
                    :value="item.pk" />
                </el-select>
              </div> -->
              <!-- 给接口传的值是PK -->
              <div>
                <div>供应商:</div>
                <el-input v-model="row.sender_name" placeholder="请输入供应商" clearable disabled size="small"
                  v-show="row.showInputSupplier"></el-input>
                <el-select v-model="row.supplierName" placeholder="请输入供应商" clearable :style="{ width: '100%' }" remote
                  :remote-method="searchSelectSupplierPk" :loading="loading" filterable
                  :disabled="row.Is_kc_Code == '1' || row.Is_kc_Code == ''" @change="handleSupplierNameChange"
                  v-show="!row.showInputSupplier">
                  <el-option v-for="(item, index) in supplierNameOptions" :key="index" :label="item.name"
                    :value="item.pk" />
                </el-select>
              </div>
              <div>
                <div>库存状态:</div>
                <el-select v-model="row.cstateid" placeholder="请选择下拉选择" :style="{ width: '100%' }"
                  :disabled="row.Is_kc_Code == '2' || row.Is_kc_Code == ''">
                  <el-option v-for="item in NccStatusOptions" :key="item.index" :label="item.label"
                    :value="item.value"></el-option>
                </el-select>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="日期信息" width="230">
            <template #default="{ row }">
              <div class="dateDiv">
                <div class="dateSpan">生产日期</div>
                <el-date-picker v-model="row.pd_date" type="datetime" format="yyyy-MM-dd HH:mm:ss"
                  value-format="yyyy-MM-dd HH:mm:ss" placeholder="请选择日期" clearable :style="{ flex: '1', width: 'auto' }"
                  :disabled="row.qualitymanflag === 'N'" @change="validateDate('pd_date', row)">
                </el-date-picker>
              </div>
              <div class="dateDiv">
                <div class="dateSpan">有 效 期</div>
                <el-date-picker v-model="row.exp_date" type="datetime" format="yyyy-MM-dd HH:mm:ss"
                  value-format="yyyy-MM-dd HH:mm:ss" placeholder="请选择日期" clearable :style="{ flex: '1', width: 'auto' }"
                  :disabled="row.qualitymanflag === 'N'" @change="validateDate('exp_date', row)">
                </el-date-picker>
              </div>
              <div class="dateDiv">
                <div class="dateSpan">复 验 期</div>
                <el-date-picker v-model="row.retest_date" type="datetime" format="yyyy-MM-dd HH:mm:ss"
                  value-format="yyyy-MM-dd HH:mm:ss" placeholder="请选择日期" clearable :style="{ flex: '1', width: 'auto' }"
                  @change="validateDate('retest_date', row)">
                </el-date-picker>
              </div>
            </template>
            <!-- readonly:将输入框设置为只读状态，用户可以看到内容，但不能修改 -->
            <!-- disabled:将输入框会变成不可编辑状态，用户无法在其中输入内容，也不能进行复制、粘贴等操作 -->
          </el-table-column>
          <!-- 其他信息 -->
          <el-table-column label="其他信息">
            <template #default="{ row }">
              <div>
                <div>合箱说明：</div>
                <el-input v-model="row.hxsm" placeholder="请输入信息" clearable size="small"></el-input>
              </div>
              <div>
                <div>供应商代码：</div>
                <el-input v-model="row.vbcdef2" placeholder="请输入信息" clearable size="small"></el-input>
              </div>
              <div>
                <div>包材版本：</div>
                <el-input v-model="row.vbcdef3" placeholder="请输入信息" clearable size="small"></el-input>
              </div>
              <div>
                <div>重量：</div>
                <el-input v-model="row.nweight" placeholder="请输入数量" clearable size="small"></el-input>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="操作" width="80" align="center">
            <template #default="{ row }">
              <!-- <el-button type="danger" size="small" plain @click="handleDeleteRow(row)">作废</el-button> -->
              <el-button type="danger" icon="el-icon-delete" size="small" plain
                @click="handleDeleteRow(row)"></el-button>
            </template>
          </el-table-column>
        </el-table>

        <el-form-item size="large" style="margin-top: 20px; float: right;">
          <el-button type="primary" @click="createOtherInboundAddOtherOrderList">提交</el-button>
          <!-- <el-button @click="resetForm">重置</el-button> -->
        </el-form-item>
      </el-form>
    </el-card>

    <!-- el-dialog对话框 -->
    <el-dialog title="单据信息" :visible.sync="dialogVisible" width="80%" @close="handleClose">
      <!-- 这里可以放置对话框内部的内容 -->
      <el-row :gutter="10">
        <!-- <el-form>
          <span style="font-size: large">单据信息</span>
        </el-form> -->
        <el-form ref="elForm" :model="headerList" :rules="rules" size="small" label-width="80px"
          style="margin-top: 10px;">
          <el-col :span="10">
            <!-- <el-form-item label="批号">
              <el-input v-model="vbatchcode" placeholder="请输入批号" clearable @input="handleBatchCodeChange" />
            </el-form-item> -->
            <el-form-item label="批号">
              <el-autocomplete v-model="vbatchcode" :fetch-suggestions="queryBatchCode" placeholder="请输入批号" clearable
                @input="handleBatchCodeChange" @select="handleBatchSelect" />
            </el-form-item>

          </el-col>

          <el-col :span="4">
            <el-form-item label="批次模式">
              <el-select v-model="modeType" placeholder="选择批号模式" clearable @change="handleModeTypeChange">
                <el-option label="等于任意一个" value="0"></el-option>
                <el-option label="等于" value="1"></el-option>
                <el-option label="不等于" value="2"></el-option>
                <el-option label="包含" value="3"></el-option>
                <el-option label="不包含" value="4"></el-option>
              </el-select>
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item>
              <span class="dialogTishi">请优先选择第一条明细入库!</span>
            </el-form-item>
          </el-col>

          <el-col :span="24">
            <el-table :data="batchCodeList" border
              style="width: 96%; margin: 0 auto; min-height:100px;margin-bottom: 20px;" @row-click="handleRowClick">
              <el-table-column label="药品名称" align="center">
                <template #default="{ row }">{{ row.name }}</template>
              </el-table-column>
              <el-table-column label="仓库" align="center">
                <template #default="{ row }">{{ row.cwarehouse_name }}</template>
              </el-table-column>
              <el-table-column label="状态" align="center">
                <template #default="{ row }">{{ row.SkuState }}</template>
              </el-table-column>
              <el-table-column label="批号" align="center">
                <template #default="{ row }">{{ row.vbatchcode }}</template>
              </el-table-column>
              <el-table-column label="供应商批号" align="center">
                <template #default="{ row }">{{ row.vvendbatchcode }}</template>
              </el-table-column>
              <!-- <el-table-column label="供应商" align="center">
                <template #default="{ row }">{{ row.sender_name }}</template>
              </el-table-column> -->
              <el-table-column label="生产商" align="center">
                <template #default="{ row }">{{ row.product_name }}</template>
              </el-table-column>
              <el-table-column label="数量信息">
                <template #default="{ row }">
                  <div>数量：{{ row.sku_num }}</div>
                  <div>可用数量：{{ row.use_num }}</div>
                  <div>冻结数量：{{ row.freeze_num }}</div>
                  <div>在途数量：{{ row.enable_num }}</div>
                </template>
              </el-table-column>
              <el-table-column label="生产日期" align="center">
                <template #default="{ row }">{{ row.pd_date }}</template>
              </el-table-column>
              <el-table-column label="有效期" align="center">
                <template #default="{ row }">{{ row.exp_date }}</template>
              </el-table-column>
              <el-table-column label="复验期" align="center">
                <template #default="{ row }">{{ (row.retest_date === "1900-01-01 00:00:00") ? null : row.retest_date
                }}</template>
              </el-table-column>
              <el-table-column label="包材版本" align="center">
                <template #default="{ row }">{{ row.vbcdef3 }}</template>
              </el-table-column>
            </el-table>
          </el-col>
        </el-form>
      </el-row>
    </el-dialog>
  </div>
</template>

<script>

// 根据NCC物料主键获取物料详细信息接口
import { getSelectNccMaterial } from '@/api/public.js'
// 新增其他入库单据接口
import { createOtherInboundAddOtherOrder } from '@/api/storage/otherStore.js'

// 根据NCC物料(信息)获取物料详细信息接口
import { getSelectNccMaterialName } from '@/api/public.js'

// 根据获取NCC物料库存信息接口
import { getSelectNccMaterialInfo } from '@/api/public.js'

// 通过物料PK获取仓库信息接口
import { getWarehouse } from '@/api/public.js'

// 引入下拉框方法组件
import SearchSelect from '@/views/components/dropDown/searchSelect.js';


/**
 * 防抖（debounce）函数
 * @param {Function} fn - 需要防抖处理的函数
 * @param {number} delay - 延迟执行的时间（毫秒）
 * @returns {Function} 返回一个新的函数，该函数会在 `delay` 时间后执行 `fn`
 */
function debounce(fn, delay) {
  let timer; // 定义一个定时器变量，用于存储 setTimeout 的 ID

  return function (...args) { // 返回一个闭包函数，接收任意参数
    if (timer) clearTimeout(timer); // 如果已有定时器，先清除，避免重复触发
    timer = setTimeout(() => fn.apply(this, args), delay);
    // 设置新的定时器，在 `delay` 毫秒后执行 `fn`
    // 使用 `apply(this, args)` 以保证 `fn` 能正确接收参数并绑定上下文
  };
}


export default {
  // 用于存储需要加载的字典类型
  dicts: ['other_in_type'],
  data() {
    return {
      loading: false, // 控制加载状态
      selectedRow: null, // 当前选中的表格行
      tableRowChecked: [], // 用于记录每行的选中状态
      headerList: {
        cwarehouseid: '', // 用于绑定仓库信息下拉框选中的值
        nccUser: '', // 采购员-用于绑定NCC用户信息下拉框选中的值
        nccUserPro: '', // 仓库管理员-用于绑定NCC用户信息下拉框选中的值
        deptName: '', // 部门名称
        drequiredate: '', // 订单日期
        vnote: '', // 备注
        ctrantypeid: '0001A11000000000CJUH', // 出入库类型

        materialName: '', // 物料信息
        pk_material: '',
        modeCode: 1 // 默认按编码查
      },

      proList: {
        manufacturerName: '',
        supplierName: '',
        cstateid: ''
      },
      materialList: [], // 将其初始化为数组，方便后续进行符合响应式的操作

      NccStockOptions: [], // 搜索NCC仓库信息_1
      NccStatusOptions: [], // 获取NCC库存状态信息_2
      NccUserOptions: [], // 获取NCC用户信息_3
      NccUserOptionsPro: [], // 获取NCC用户信息_3
      deptNameOptions: [], // 获取NCC-普锐特部门信息_4
      materialNameOptions: [], // 获取NCC物料信息_5
      manufacturerNameOptions: [], // 获取NCC生产厂商信息_6/_13
      supplierNameOptions: [], // 获取NCC供应商信息_7/_10
      usernameOptions: [], // 获取NCC用户信息-code_11
      rules: {
        // 移除仓库必填验证
        // cwarehouseid: [
        //   { required: true, message: '请选择仓库', trigger: 'change' }
        // ],
        nccUser: [
          { required: true, message: '请选择采购员', trigger: 'change' }
        ],
        nccUserPro: [
          { required: true, message: '请选择仓库管理员', trigger: 'change' }
        ],
        deptName: [
          { required: true, message: '请选择部门信息', trigger: 'change' }
        ],
        drequiredate: [
          { required: true, message: '请选择订单日期', trigger: 'change' }
        ],
        // vnote: [
        //   { required: true, message: '请输入备注', trigger: 'blur' }
        // ],
        ctrantypeid: [
          { required: false, message: '请选择出入库类型', trigger: 'change' }
        ],
        materialName: [
          { required: true, message: '请选择物料信息', trigger: 'change' }
        ]
      },
      materialDetailsList: [], // 表格数据
      allMaterialDetailsList: [], // 初始获取的完整表格数据
      isSearchComplete: false, // 查询完成标志，防止点击输入框时重复触发

      vbatchcode: '', // 查询的批号
      currentPkMaterial: null, // 存储pk_material
      modeType: '3',  // 批次模式(批号模式 0：等于任意一个 1：等于 2：不等于 3：包含 4：不包含)
      batchCodeList: [], // 表格数据
      filteredBatchCodeList: [], // 经过模糊查询筛选后的批号数据

      dialogVisible: false, // 控制更对话框显示隐藏
      ctrantypeidOptions: [], //  存储查询的采购类型

      warehouseOptions: [],  // 存储仓库选项
      materialTypeOptions: [],  // 存储仓库选项

      disabledFlag: "Y",

    }
  },
  created() {
    // 查询字典
    this.getDicts("other_in_type").then((res) => {
      this.ctrantypeidOptions = res.data;
      // console.log("this.ctrantypeidOptions数据为:", this.ctrantypeidOptions)
    });
  },
  computed: {
    // 计算属性，判断是否禁用仓库选择框
    isWarehouseSelectDisabled() {
      return this.warehouseOptions.length === 0;
    }
  },
  mounted() {
    this.searchNCCStockList(); // 1、获取NCC仓库信息
    this.searchNCCStockStatusList(); // 2、获取NCC库存状态信息
    this.searchSelectNccUserList(); // 3、获取NCC用户信息
  },
  methods: {
    // 实收主数量与实收辅数量转换
    calculateAssistNum(row) {
      // 如果输入的不是有效的数字，清空并提示
      // if (isNaN(row.nnum) || row.nnum === '') {
      //   this.$message.error('请输入有效的数字');
      //   row.nnum = '';  // 清空字段
      //   row.nassistnum = ''; // +++确保清空辅数量
      //   return;
      // }
      // 检查输入是否为有效的正数
      if (isNaN(row.nnum) || row.nnum === '' || parseFloat(row.nnum) < 0) {
        this.$message.error('请输入有效的正数,负数请走其他出库单');
        row.nnum = '';  // 清空字段
        row.nassistnum = ''; // 确保清空辅数量
        return;
      }


      // 如果实收主数量为空，则将实收辅数量置为空
      if (!row.nnum || row.nnum === '') {
        row.nassistnum = ''; // 确保清空辅数量
        return;
      }

      // 转换主数量为浮点数
      const mainNum = parseFloat(row.nnum);

      // 判断是否超过应收主数量
      // const shouldMainNum = parseFloat(row.nshouldnnum);
      // if (mainNum > shouldMainNum) {
      //   this.$message({
      //     message: '实收主数量不能超过应收主数量',
      //     type: 'warning'
      //   });
      //   // 恢复到应收主数量
      //   row.nnum = shouldMainNum;
      //   return;
      // }

      // 检查转换率是否有效
      const changerateArr = row.HSXS.split('/');
      const factor = parseFloat(changerateArr[1]) / parseFloat(changerateArr[0]);
      if (isNaN(factor)) {
        row.nassistnum = ''; // 如果转换率无效，清空辅数量
        return;
      }

      // 计算辅数量并更新
      row.nassistnum = (mainNum * factor).toFixed(4); // 这里保留两位小数，可按需调整
    },
    // 应收主数量与应收辅数量转换
    calculateAssistNshouldNum(row) {
      // 检查输入是否为有效的正数，清空并提示
      if (isNaN(row.nshouldnum) || row.nshouldnum === '' || parseFloat(row.nshouldnum) < 0) {
        this.$message.error('请输入有效的正数,负数请走其他出库单');
        row.nshouldnum = '';  // 清空字段
        row.nshouldassistnum = ''; // 确保清空辅数量
        return;
      }

      // 如果应收主数量为空，则将应收辅数量置为空
      if (!row.nshouldnum || row.nshouldnum === '') {
        row.nshouldassistnum = ''; // 确保清空辅数量
        return;
      }

      // 检查库存数量是否存在且不为空
      if (row.sku_num && !isNaN(parseFloat(row.sku_num))) {
        const stockNum = parseFloat(row.sku_num);
        const mainNum = parseFloat(row.nshouldnum);
        if (mainNum > stockNum) {
          this.$message({
            message: '应收主数量不能超过库存数量',
            type: 'warning'
          });
          // 清空数量
          row.nshouldnum = '';  // 清空字段
          row.nshouldassistnum = ''; // 确保清空辅数量
          return;
        }
      }

      // 转换应收主数量为浮点数
      const mainNum = parseFloat(row.nshouldnum);

      const changerateArr = row.HSXS.split('/');
      const factor = parseFloat(changerateArr[1]) / parseFloat(changerateArr[0]);
      if (isNaN(factor)) {
        row.nshouldassistnum = ''; // 如果转换率无效，清空辅数量
        return;
      }

      // 计算应收辅数量并更新
      row.nshouldassistnum = (mainNum * factor).toFixed(4); // 这里保留两位小数，可按需调整
    },

    // 统一校验(时间信息)的方法
    validateDate(field, row) {
      // 获取当前日期，设置为当天的最大时间（23:59:59），确保不超过今天
      const today = new Date();
      const currentDateString = today.toISOString().split('T')[0] + ' 23:59:59'; // 获取今天的最大时间

      // 校验生产日期不能超过今天
      if (field === 'pd_date' && new Date(row.pd_date) > new Date(currentDateString)) {
        this.$message.error('生产日期不能超过今天');
        row.pd_date = null;  // 清空该值
        return;
      }

      // 校验有效期、复验期、货架期要严格大于生产日期
      if (field !== 'pd_date') {
        const producedDate = row.pd_date ? new Date(row.pd_date) : null;
        const dateToValidate = new Date(row[field]);

        // 如果生产日期存在，并且有效期、复验期、货架期小于等于生产日期，则清空并提示
        if (producedDate && dateToValidate <= producedDate) {
          this.$message.error(`${this.getFieldLabel(field)}必须严格大于生产日期`);
          row[field] = null;  // 清空该字段的值
        }
      }
    },

    // 根据字段名返回相应的字段标签，用于动态显示提示信息
    getFieldLabel(field) {
      const labels = {
        exp_date: '有效期',
        retest_date: '复验期',
      };
      return labels[field] || '';
    },


    // 处理表格行选择事件
    handleTableSelectionChange(selectedRows) {
      // 根据传入的当前选中的行数据数组selectedRows，更新tableRowChecked数组来标记每行的选中状态
      this.tableRowChecked = this.materialList.map(
        row => selectedRows.includes(row)
      );
      // 将当前选中的行数据整体赋值给selectedRow属性
      this.selectedRow = selectedRows;
    },
    handleCwarehouseidChange(cwarehouseid) {
      // 在这里添加根据仓库变化需要执行的业务逻辑
      console.log('选择的仓库值改变了:', cwarehouseid);
    },
    handleManufacturerNameChange(manufacturerName) {
      // 这里添加选择生产商后需要执行的逻辑
      console.log('选择的生产商值改变了:', manufacturerName);
    },
    handleSupplierNameChange(supplierName) {
      // 这里添加选择供应商后需要执行的逻辑
      console.log('选择的供应商值改变了:', supplierName);
    },

    // 对 searchSelectNccMaterial 方法进行防抖（debounce）处理，避免用户在输入框中快速输入时，频繁触发 API 请求
    debounceSearchSelectNccMaterial: debounce(function (query) {
      this.searchSelectNccMaterial(query);
    }, 500), // 500ms 防抖
    /**
    * 处理下拉框的远程搜索方法
    * 当用户在下拉框中输入内容时会触发此方法，用于根据用户输入的查询词去后端获取匹配的物料信息
    * @param {string} query 用户在下拉框中输入的查询词
    */
    async searchSelectNccMaterial(query) {
      if (!query || query.length < 3) {
        // 1. 限制最少输入 3 个字符后再查询
        this.materialNameOptions = [];
        return;
      }

      if (this.isSearchComplete) {
        this.isSearchComplete = false; // 重置标志，以便下次真正输入时能查询
        return;
      }

      this.loading = true;

      try {
        const response = await getSelectNccMaterialName({
          materialName: query,
          modeCode: this.headerList.modeCode
        });

        this.materialNameOptions = response.data.map(item => ({
          name: item.label, // 物料名称
          pk: item.value, // 物料主键
        }));
        console.log('this.materialNameOptions=', this.materialNameOptions);
      } catch (error) {
        console.error('查询物料信息出错:', error);
      } finally {
        this.loading = false;
      }
    },
    /**
    * 处理物料选择变化的方法
    * 当用户从下拉框中选择了一个物料选项时会触发此方法
    * @param {string} value 被选中的物料选项的值（通常是物料的唯一标识，pk）
    */
    handleMaterialChange(value) {
      // 处理物料选择变化的逻辑
      console.log('选择的物料值:', value);
      this.fetchMaterialDetails(value);
    },
    /**
    * 处理切换查询模式开关变化的方法
    * 当用户切换查询模式（按编码查或按名称查）的开关时会触发此方法
    * @param {number} value 开关的当前值，1 表示按编码查，0 表示按名称查
    */
    checkModeCodeChange(value) {
      // 处理查询模式变化的逻辑
      console.log('查询模式已变更为:', value === 1 ? '按编码查' : '按名称查');
    },

    /**
     * 根据物料主键获取物料详细信息并更新表格数据
     */
    async fetchMaterialDetails(pk_material) {
      try {
        const response = await getSelectNccMaterial(pk_material);
        console.log('后面-----获取物料详细信息response:', response);

        // 将接口返回的数据合并到已有的materialDetailsList数组中(假设每次获取的是单条物料详细信息，如需处理多条可调整逻辑)
        this.materialDetailsList.push(response.data);

        const materialData = response.data
        console.log('获取物料materialData详细信息', materialData);

        // 存储pk_material
        this.currentPkMaterial = materialData.pk_material;
        console.log('存储pk_material的===currentPkMaterial', this.currentPkMaterial);

        this.getSelectNccMaterialInfoList(); // 获取库存信息并更新表单数据
        this.fetchWarehouseOptions(); // 获取仓库信息

        // this.dialogVisible = true;
        // 判断this.currentPkMaterial是否为空，确保只有在获取到有效的物料主键时才会显示对话框
        if (this.currentPkMaterial) {
          this.dialogVisible = true;
        } else {
          this.dialogVisible = false;
        }

      } catch (error) {
        // this.$message.error('获取物料详细信息接口调用出错');
        console.log('获取物料详细信息接口调用出错:', error);
      }
    },


    // 获取仓库信息并更新到 基本信息的 仓库 下拉选择框中，默认截取的第一个仓库下拉选项
    async fetchWarehouseOptions() {
      try {
        const pk = this.currentPkMaterial;
        console.log('fetchWarehouseOptions->', pk);
        const response = await getWarehouse(pk);  // 调用 getWarehouse 获取仓库信息
        console.log('fetchWarehouseOptions(response)', response);

        if (response.code === 200 && response.data) {
          // 对仓库信息进行去重
          const labelSet = new Set();
          const uniqueWarehouseOptions = response.data.filter(item => {
            if (labelSet.has(item.sto_name)) {
              return false;
            }
            labelSet.add(item.sto_name);
            return true;
          });
          console.log('uniqueWarehouseOptions(1)=', uniqueWarehouseOptions);
          // 更新仓库选项
          const warehouseOptions = uniqueWarehouseOptions.map(item => ({
            label: item.sto_name,
            value: item.ncc_warehouse_id
          }));
          // 假设这些数据要设置到当前组件实例的 data 里
          this.$set(this, 'warehouseOptions', warehouseOptions);

          // 设置默认值
          if (warehouseOptions.length > 0) {
            // 将 headerList.cwarehouseid 设置为第一个选项的值
            this.$set(this.headerList, 'cwarehouseid', warehouseOptions[0].value);
          }
          console.log('fetchWarehouseOptions(warehouseOptions)', warehouseOptions);

          this.$forceUpdate(); // 强制更新视图
        } else {
          this.$message.warning("未获取到仓库信息");
        }
      } catch (error) {
        console.log('获取物料详细信息接口调用出错:', error);
        // this.$message.error('获取物料详细信息接口调用出错');
      }
    },


    // 获取库存信息并更新表单数据
    getSelectNccMaterialInfoList() {
      this.loading = true;
      const params = {
        primaryKey: this.currentPkMaterial,
        batchNo: this.vbatchcode,
        modeType: this.modeType,
        // +++这里传值需要将三个参数全部传入值，如果参数没有值，传入空值
      };
      console.log('接口请求params：', params);
      getSelectNccMaterialInfo(params)
        .then((response) => {
          console.log('接口请求成功，NCC物料库存信息：', response);
          if (response.code === 200) {
            const responseData = response.data;
            // console.log("NCC物料库存信息responseData:", responseData);
            this.batchCodeList = responseData;
            // console.log("NCC物料库存信息batchCodeList:", responseData);

          } else {
            this.$message.error('提交失败，请稍后再试');
          }
          this.loading = false;
        })
        .catch((error) => {
          this.loading = false;
          console.log('接口请求出错:', error);
        });
    },



    handleBatchCodeChange() {
      // 如果输入的批号为空字符串，则将筛选后的批号列表重置为全部批号列表
      if (!this.vbatchcode) {
        this.filteredBatchCodeList = this.batchCodeList;
        console.log("未输入批号，恢复所有数据:", this.filteredBatchCodeList);
        return;
      }

      // 在 handleBatchCodeChange 方法中
      this.filteredBatchCodeList = this.batchCodeList.filter(item => {
        return item.vbatchcode.toLowerCase().includes(this.vbatchcode.toLowerCase());
      });

      console.log("输入批号:", this.vbatchcode);
      console.log("筛选后的批号列表:", this.filteredBatchCodeList);

      // 将筛选后的批号列表赋值给原始的批次号列表
      this.batchCodeList = this.filteredBatchCodeList;
    },
    // 查询批号（给 el-autocomplete 用的）
    queryBatchCode(queryString, cb) {
      if (!queryString) {
        return cb(this.filteredBatchCodeList.map(item => ({ value: item.vbatchcode })));
      }
      const results = this.filteredBatchCodeList
        .filter(item => item.vbatchcode.toLowerCase().includes(queryString.toLowerCase()))
        .map(item => ({ value: item.vbatchcode }));
      cb(results);
    },

    // 选择批号
    handleBatchSelect(item) {
      this.vbatchcode = item.value;
      this.handleBatchCodeChange(); // 触发筛选
    },

    // 当点击 el-table 的某一行时，弹出确认框,执行完整数据同步等逻辑
    async handleRowClick(row) {
      this.$confirm('是否选择同步全部信息', '提示', {
        confirmButtonText: '是',
        cancelButtonText: '否',
        type: 'warning'
      }).then(async () => {
        // 用户点击“是”

        let manufactOption = null;
        let supplierOption = null;

        // 先检查 row 对象中是否存在 product_name 和 sender_name 字段。如果不存在，就跳过这部分逻辑
        if (row.product_name || row.sender_name) {
          // 触发生产商模糊查询
          const manufacturerQuery = row.product_name;
          // await this.searchSelectNccManufacturer(manufacturerQuery);
          await this.searchSelectNccManufacturerPk(manufacturerQuery);

          // 触发供应商模糊查询
          const supplierQuery = row.sender_name;
          // await this.searchSelectNccSupplier(supplierQuery);
          await this.searchSelectSupplierPk(supplierQuery);

          // 模糊匹配生产商（使用 indexOf 替代 includes 进行优化）
          const holderName = row.product_name?.trim().toLowerCase();
          manufactOption = this.manufacturerNameOptions.find(option => {
            const optionName = option.name?.trim().toLowerCase();
            return optionName && optionName.indexOf(holderName) > -1;
          });
          console.log("映射holderName:", holderName);

          // 模糊匹配供应商（使用 indexOf 替代 includes 进行优化）
          const supplierName = row.sender_name?.trim().toLowerCase();
          supplierOption = this.supplierNameOptions.find(option => {
            const optionSupplierName = option.name?.trim().toLowerCase();
            return optionSupplierName && optionSupplierName.indexOf(supplierName) > -1;
          });
        }


        // 映射 SkuState 到 cstateid
        const statusOption = this.NccStatusOptions.find(option => option.label === row.SkuState);

        // 处理日期
        const pdDate = row.pd_date === "1900-01-01 00:00:00" ? '' : row.pd_date;
        const expDate = row.exp_date === "1900-01-01 00:00:00" ? '' : row.exp_date;
        const retestDate = row.retest_date === "1900-01-01 00:00:00" ? '' : row.retest_date;


        // 确保状态选项存在才映射
        const mappedRow = {
          ...row,
          manufacturerName: manufactOption ? manufactOption.pk : null, // 生产商
          supplierName: supplierOption ? supplierOption.pk : null, // 供应商
          cstateid: statusOption ? statusOption.value : null, // 库存状态
          pd_date: pdDate, // 生产日期
          exp_date: expDate, // 有效期
          retest_date: retestDate // 复验期
        };

        // 设置生产商和供应商的显示状态
        mappedRow.showInputManufacturer = true;
        mappedRow.showInputSupplier = true;


        // console.log("映射statusOption:", statusOption);
        // console.log("映射mappedRow:", mappedRow);
        // console.log("映射manufactOption:", manufactOption);
        // console.log("映射supplierOption:", supplierOption);

        // +++1：检查目标表格中是否已存在相同批次号的行数据（检查目标表格中是否已存在相同行数据的逻辑映射判断---保留）
        // const exists = this.materialList.some(item =>
        //   // item.vbatchcode === row.vbatchcode
        //   item.pk_material === row.pk_material

        // );
        // console.log("判断是否重复exists:", exists);
        // if (!exists) {
        //   this.materialList.push(mappedRow);
        //   this.$message.success("数据已同步至目标表格");
        //   this.dialogVisible = false;
        // } else {
        //   this.$message.warning("该行数据已存在于目标表格");
        // }

        //+++2：直接将映射后的行数据添加到目标表格数据中
        this.materialList.push(mappedRow);
        // 显示成功提示消息，告知用户数据已成功同步至目标表格
        this.$message.success("数据已同步至目标表格");
        // 关闭对话框，因为数据已经同步完成
        this.dialogVisible = false;
      }).catch(() => {
        // 用户点击“否”时执行以下代码

        // 创建一个部分映射的行数据对象，只包含部分字段
        const partialMappedRow = {
          name: row.name, // 物料名称
          code: row.code, // 物料code
          pk_material: row.pk_material, // 物料pk
          cwarehouse_name: row.cwarehouse_name, // 仓库
          sto_id: row.sto_id, // WMS库房ID
          stu_class_id: row.stu_class_id, // WMS库房商品分类ID
          HSXS: row.HSXS, // 换算系数
          qualitymanflag: row.qualitymanflag, // 效期管理
          wholemanaflag: row.wholemanaflag,  // 批次管理
          Is_kc_Code: row.Is_kc_Code,  // 生产商，供应商，库存状态

          showInputManufacturer: false,
          showInputSupplier: false,
        };

        // 1：检查目标表格中是否已存在相同批次号的行数据（检查目标表格中是否已存在相同行数据的逻辑映射判断-- - 保留）
        // const exists = this.materialList.some(item =>
        //   item.vbatchcode === row.vbatchcode
        // );

        // if (!exists) {
        //   this.materialList.push(partialMappedRow);
        //   this.$message.success("部分数据已同步至目标表格");
        //   this.dialogVisible = false;
        // } else {
        //   this.$message.warning("该行部分数据已存在于目标表格");
        // }

        //2：直接将映射后的行数据添加到目标表格数据中
        this.materialList.push(partialMappedRow);
        this.$message.success("部分数据已同步至目标表格");
        this.dialogVisible = false;
      });
    },

    //处理作废行的操作
    handleDeleteRow(row) {
      // 通过准确匹配 row.id 来作废指定行数据
      const index = this.materialList.findIndex(item => item.id === row.id);

      // 如果找到了对应行，执行作废
      if (index !== -1) {
        this.materialList.splice(index, 1); // 作废指定索引的行
        this.$message.info("已作废选中行");
      } else {
        this.$message.warning("未找到要作废的行");
      }
    },

    /**
    * 提交---新增其他入库单据
    */
    createOtherInboundAddOtherOrderList() {
      // 开启加载状态提示
      this.loading = true;
      console.log('进入createOtherInboundAddOtherOrderqmsList方法，当前headerList.pk_material的值为:', this.headerList.pk_material);

      // 直接根据tableRowChecked数组筛选出选中行数据，即获取当前在表格中被用户勾选的行数据
      const selectedRows = this.materialList.filter((_, index) => this.tableRowChecked[index]);

      // 如果没有选中任何行，给出提示信息告知用户需要选择入库项，并关闭加载状态提示，直接返回不再继续后续操作
      if (!selectedRows.length) {
        this.$message.warning('请选择待其他入库的明细行');
        this.loading = false;
        return;
      }

      // +++获取表头仓库信息
      const headerWarehouseId = this.headerList.cwarehouseid;
      const headerWarehouseName = this.NccStockOptions.find(item => item.value === headerWarehouseId)?.label;

      // +++校验表头仓库信息和表格中库房名称是否一致
      const isWarehouseConsistent = selectedRows.every(row => row.cwarehouse_name === headerWarehouseName);

      if (!isWarehouseConsistent) {
        this.$message.error('表头仓库信息和表格中库房名称不一致，请检查后提交');
        this.loading = false;
        return;
      }


      // 将选中行的数据进行整理，提取出需要传递给后端接口的各个字段信息，
      // 组成新的对象数组materialList，准确提取对应字段的值
      const materialList = selectedRows.map(row => ({
        cmaterialvid: row.pk_material, // 物料PK

        // GMP: row.GMP,//GMP码
        // materialspec: row.materialspec,//规格
        // materialtype: row.materialtype,//型号

        // cwarehouse_name: row.cwarehouse_name,//库房名称
        // cwarehouse_id: row.cwarehouse_id,//库房ID
        // sto_unit_id: row.sto_unit_id,//货位号

        // PZWH: row.PZWH,//批准文号
        // vvendbatchcode: row.vvendbatchcode, // 供应商批号
        // SSCYR: row.SSCYR,//持有人/注册人
        vbatchcode: row.vbatchcode, // 批次号

        // sku_num: row.sku_num,//库存数量
        // enable_num: row.enable_num,//在途数量
        // freeze_num: row.freeze_num,//冻结数量
        // use_num: row.use_num,//可用数量

        nnum: row.nnum,// 实收主数量
        nassistnum: row.nassistnum,// 实收辅数量
        nshouldnum: row.nshouldnum,// 应收主数量
        nshouldassistnum: row.nshouldassistnum,// 应收辅数量

        cproductorid: row.product_pk, // 生产商product_pk
        cproductorid: row.manufacturerName, // 生产商 (下拉框传值所需)
        cvendorid: row.sender_pk, // 供应商sender_pk
        cvendorid: row.supplierName, // 供应商 (下拉框传值所需)
        cstateid: row.cstateid, // 库存状态

        dvalidate: row.exp_date, // 有效期
        dproducedate: row.pd_date, // 生产日期
        retest_date: row.retest_date, // 复验期

        vbcdef1: row.hxsm, // 合箱说明
        vbcdef2: row.vbcdef2, // 供应商代码
        vbcdef3: row.vbcdef3, // 包材版本
        nweight: row.nweight, // 重量

        parent_class_id: row.parent_class_id, // NCC的商品类型ID
        sto_id: row.sto_id, // WMS库房ID
        stu_class_id: row.stu_class_id, // WMS库房商品分类ID

      }));

      console.log('其他入库，返回materialList数据：', materialList);

      // 构建表头信息对象header，包含入库单表头主键和仓库信息等关键表头数据，用于传递给后端接口
      const ic_generalin_h = {
        cwarehouseid: this.headerList.cwarehouseid, // 仓库
        // cbizid: this.headerList.nccUser, // 采购员
        cwhsmanagerid: this.headerList.nccUserPro, // 仓库管理员
        cdptvid: this.headerList.deptName, // 部门名称
        dmakedate: this.headerList.dmakedate, // 订单日期
        vnote: this.headerList.vnote, // 备注
        ctrantypeid: this.headerList.ctrantypeid, // 出入库类型
      };

      console.log('其他出库，返回header数据：', ic_generalin_h);

      // 检查关键信息是否为空值（移除仓库必填验证）
      const isValidHeader = ic_generalin_h.cwhsmanagerid &&
        ic_generalin_h.cdptvid;

      if (!isValidHeader) {
        this.$message.error('请填写完整且正确的表头信息');
        this.loading = false;
        return;
      }

      // 将表头信息和整理好的商品明细信息整合到一个对象combinedData中
      const combinedData = { ic_generalin_h, ic_generalin_b: materialList };
      console.log('其他出库，返回combinedData数据：', combinedData);
      createOtherInboundAddOtherOrder(combinedData)
        .then(response => {
          console.log('接口请求成功，返回response数据：', response);

          this.loading = false;

          if (response.code === 200) {
            this.$message.success(response.msg);
            this.$tab.closePage(); // 关闭当前页面的标签

            // 跳转到收货管理页面
            this.$router.push('/wms/receive');
          } else {
            this.$message.error(response.msg);
          }
        })
        .catch(error => {
          this.loading = false;
          // this.$message.error(response.msg);
          console.log('接口请求出错:', error);
        });
    },

    // 关闭更新失效日期框
    handleClose() {
      this.dialogVisible = false;
      this.vbatchcode = '';
    },

    // 下拉框值变化时的逻辑处理
    handleModeTypeChange() {
      console.log("选择的批号模式:", this.modeType);

      // 如果未选择 modeType，则恢复全部数据
      if (this.modeType === 0) {
        this.materialDetailsList = [...this.allMaterialDetailsList];
        console.log("选择的materialDetailsList:", this.materialDetailsList);
      } else {
        // 根据 modeType 重新筛选并渲染表格
        this.fetchMaterialDetails("当前批次号"); // 示例批次号
      }
    },

    resetForm() {
      this.$refs.elForm.resetFields();
    },
    // 1、获取NCC仓库信息
    searchNCCStockList() {
      this.loading = true;
      SearchSelect.searchNCCStockList(this)
        .then(() => {
          // 获取到仓库信息后，更新 NccStockOptions
          this.NccStockOptions = this.NccStockList.map(item => ({
            label: item.label,
            value: item.value,
          }));

        })
        .finally(() => {
          this.loading = false;
        });
    },

    // 2、获取NCC库存状态信息
    searchNCCStockStatusList() {
      this.loading = true;
      SearchSelect.searchNCCStockStatusList(this)
        .then(() => {
          // 获取到NCC库存状态信息后，更新 NccStatusOptions
          this.NccStatusOptions = this.NccStatusList.map(item => ({
            label: item.label,
            value: item.value,
          }));
        })
        .finally(() => {
          this.loading = false;
        });
    },


    // 3、获取NCC用户信息
    searchSelectNccUserList() {
      this.loading = true;
      SearchSelect.searchSelectNccUserList(this)
        .then(() => {
          // 获取到NCC库存状态信息后，更新 NccUserOptions
          this.NccUserOptions = this.NccUserList.map(item => ({
            label: item.label,
            value: item.value,
          }));
          this.NccUserOptionsPro = this.NccUserList.map(item => ({
            label: item.label,
            value: item.value,
          }));
        })
        .finally(() => {
          this.loading = false;
        });
    },

    // 4、获取NCC-普锐特部门信息
    searchSelectNccDept(query) {
      SearchSelect.searchSelectNccDept(query, this);
    },
    // 5、获取NCC物料信息
    // searchSelectNccMaterial(query) {
    //   SearchSelect.searchSelectNccMaterial(query, this);
    // },
    // 6、获取NCC生产厂商信息-code
    // searchSelectNccManufacturer(query) {
    //   SearchSelect.searchSelectNccManufacturer(query, this);
    // },
    async searchSelectNccManufacturer(query) {
      try {
        this.loading = true;
        await SearchSelect.searchSelectNccManufacturer(query, this);
        this.loading = false;
      } catch (error) {
        console.error('查询生产商信息出错:', error);
        this.$message.error('查询生产商信息出错，请稍后重试');
        this.loading = false;
      }
    },
    // 13、获取NCC生产厂商信息-pk
    // searchSelectNccManufacturerPk(query) {
    //   SearchSelect.searchSelectNccManufacturerPk(query, this);
    // },
    async searchSelectNccManufacturerPk(query) {
      try {
        this.loading = true;
        await SearchSelect.searchSelectNccManufacturerPk(query, this);
        this.loading = false;
      } catch (error) {
        console.error('查询生产商信息出错:', error);
        this.$message.error('查询生产商信息出错，请稍后重试');
        this.loading = false;
      }
    },
    // 7、获取NCC供应商信息-code
    // searchSelectNccSupplier(query) {
    //   SearchSelect.searchSelectNccSupplier(query, this);
    // },
    async searchSelectNccSupplier(query) {
      try {
        this.loading = true;
        await SearchSelect.searchSelectNccSupplier(query, this);
        this.loading = false;
      } catch (error) {
        console.error('查询供应商信息出错:', error);
        this.$message.error('查询供应商信息出错，请稍后重试');
        this.loading = false;
      }
    },
    // 10、获取NCC供应商信息- pk
    // searchSelectSupplierPk(query) {
    //   SearchSelect.searchSelectSupplierPk(query, this);
    // },
    async searchSelectSupplierPk(query) {
      try {
        this.loading = true;
        await SearchSelect.searchSelectSupplierPk(query, this);
        this.loading = false;
      } catch (error) {
        console.error('查询供应商信息出错:', error);
        this.$message.error('查询供应商信息出错，请稍后重试');
        this.loading = false;
      }
    },
    // 11、获取NCC用户信息-code
    searchSelectNccUserCode(query) {
      SearchSelect.searchSelectNccUserCode(query, this);
    },
    // 11、获取NCC用户信息-code
    searchSelectNccUserCodePro(query) {
      SearchSelect.searchSelectNccUserCode(query, this);
    },
  }
}
</script>

<style scoped>
.dateDiv {
  margin: 5px;
}

/* 必填项红色标记 */
.mark-red {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background-color: red;
  margin-right: 5px;
}

@keyframes elasticShake {

  0%,
  100% {
    transform: translateX(0);
    animation-timing-function: ease-out;
  }

  25% {
    transform: translateX(-5px);
    animation-timing-function: ease-in;
  }

  50% {
    transform: translateX(3px);
    animation-timing-function: ease-out;
  }

  75% {
    transform: translateX(-2px);
    animation-timing-function: ease-in;
  }
}

.dialogTishi {
  float: right;
  color: #409EFF;
  font-size: 18px;
  animation: elasticShake 1.2s infinite;
}
</style>